<template>
    <!-- 添加或修改商品规格分组对话框 -->
    <el-dialog :title="title" v-if="open" v-model="open" width="500px" append-to-body>
        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
            <el-form-item label="上级分组" prop="parentId">
                <el-tree-select :props="{ value: 'id', label: 'specGroupName', children: 'children' }"
                    v-model="form.parentId" :data="groupList" clearable :render-after-expand="false" />
            </el-form-item>
            <el-form-item label="分组名称" prop="specGroupName">
                <el-input v-model="form.specGroupName" placeholder="请输入分组名称" />
            </el-form-item>
            <!-- <el-form-item label="排序" prop="sort">
                <el-input v-model="form.sort" placeholder="请输入排序" />
            </el-form-item> -->
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary" @click="submitForm" :loading="loading">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script>
import modelMixin from '@/mixins/modelMixin'
import goodsSpecGroup, { getGoodsSpecGroupAllList } from '@/api/goods/goodsSpecGroup';
import { handleTree } from '@/utils/ruoyi'
export default {
    name: "addForm",
    mixins: [modelMixin],
    data() {
        return {
            funcObj: goodsSpecGroup,//方法对象
            open: false,
            title: "添加分组",
            form: {
                sort: '0',
            },
            rules: {
                supplierClassifyName: [
                    { required: true, message: "请输入分类名称", trigger: "blur" }
                ]
            },
            groupList: [],
        }
    },
    created() {
    },
    methods: {
        add(row) {
            this.open = true;
            this.title = "添加分组";
            this.getGoodsSpecGroupAllList()
            if (row) {
                this.form = {
                    parentId: row.id,
                    classStatus: '1',
                    sort: '999'
                }
            }
        },

        /**
         * @编辑
         * @param {*} id 
         */
        edit(row) {
            this.form = Object.assign({}, row);
            this.title = "编辑分组";
            this.open = true;
            this.getGoodsSpecGroupAllList()
        },

        /** 转换数据结构 */
        normalizer(node) {
            if (node.children && !node.children.length) {
                delete node.children;
            }
            return {
                id: node.id,
                label: node.specGroupName,
                children: node.children
            };
        },
        getGoodsSpecGroupAllList() {
            getGoodsSpecGroupAllList().then(res => {
                this.groupList = [
                    {
                        id: 0,
                        specGroupName: '全部',
                        children: handleTree(res)
                    }
                ]
            })
        },
    }
}
</script>

<style lang="scss" scoped></style>